"use strict";
import * as React from 'react';
import { commonStyles } from "../assets/styles/common";
import { inPutProps, searchBarStyles } from "../assets/styles/searchBar";
import MyIcon from "./icon";
import MyText from "./MyText";
const { View, TextInput, TouchableOpacity, PanResponder } = require('react-native');
const { connect } = require('react-redux');
class SearchBar extends React.Component {
    constructor() {
        super(...arguments);
        this.getPaddingStyle = () => ({ paddingRight: this.props.rightButtonWidth + 10, paddingLeft: this.props.leftButtonWidth + 10 });
        this.renderContent = () => {
            if (this.props.onPress) {
                return (<TouchableOpacity style={searchBarStyles.textInputContainer} activeOpacity={1} onPress={this.props.onPress}>
                    <MyIcon name={this.props.leftIconName} size={20} color='#999999'/>
                    <MyText color={'#999'} style={{ marginLeft: 10 }}>{this.props.placeholder || '搜索...'}</MyText>
                    
                               
                               
                </TouchableOpacity>);
            }
            return (<View style={searchBarStyles.textInputContainer} onPress={this.props.onPress}>
                <MyIcon name={this.props.leftIconName} size={20} color='#999999'/>
                <TextInput {...inPutProps} {...this.props} style={[commonStyles.flex1, searchBarStyles.input]}/>
            </View>);
        };
    }
    render() {
        return (<View style={[commonStyles.flex1, searchBarStyles.container, Object.assign({}, this.getPaddingStyle())]} activeOpacity={1}>
                {this.renderContent()}
            </View>);
    }
}
SearchBar.defaultProps = {
    placeholder: '搜索',
    rightButtonWidth: 60,
    leftButtonWidth: 0,
    leftIconName: 'icon-sousuo',
    onPress: null
};
export default SearchBar;
